<%-- 
    Document   : GestionCompte
    Created on : 2012-03-24, 17:58:07
    Author     : Étienne
--%>

<%@page import="java.util.Map"%>
<%@page import="java.math.BigDecimal"%>
<%@page import="java.util.HashMap"%>
<%@page import="application.beans.CompteBean"%>
<%@page import="java.util.List"%>
<%@page import="controleur.ConstantesWeb"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%
    CompteBean utilisateur = (CompteBean)session.getAttribute(ConstantesWeb.ATTRIBUT_UTILISATEUR);
    List<CompteBean> resultats = (List<CompteBean>)session.getAttribute(ConstantesWeb.ATTRIBUT_RESULTAT_GESTION_COMPTE);
    // On va chercher le numéro de page
    Integer numPage = (Integer)session.getAttribute(ConstantesWeb.PARAM_NUM_PAGE);
    
    // On va chercher les listes constantes
    HashMap<Integer,String> domaines = (HashMap<Integer,String>)session.getAttribute(ConstantesWeb.ATTRIBUT_DOMAINES);
    HashMap<Integer,String> statuts = (HashMap<Integer,String>)session.getAttribute(ConstantesWeb.ATTRIBUT_STATUTS);
%>
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="CSS/styleGestionCompte.css" type="text/css"/>
        <link rel="stylesheet" href="CSS/styleGeneral.css" type="text/css"/>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Gestion des comptes</title>
        <script type="text/javascript" src="Scripts/jQuery.js"></script>
        <script type="text/javascript" src="Scripts/scriptsGeneraux.js"></script>
        <script type="text/javascript" src="Scripts/scriptsAJAX.js"></script>
        <script  type="text/javascript">
            $(document).ready(function(){
                $('.unCompte:odd').addClass('impair');
                
                // Fonction pour faire la recherche au click du bouton
                $('#btnRecherche').click(function(){
                    $('#formRecherche').submit();
                });
                
                // Fonction pour faire la recherche en appuyant sur la touche "Enter" dans un critère
                $('.critere').keypress(function(e){
                    if(e.keyCode == 10 || e.keyCode == 13){$('#btnRecherche').click();}
                })
                
                // Fonction pour ouvrir la fenêtre de nouveau compte
                $('#btnNouveau').click(function(){
                    $('#espDisable').show();
                    $('#espNouveau').fadeIn(250);
                });
                
                // Fonction faisant en sorte qu'un seul compte est coché à la fois
                $('.chkCompte').change(function(){
                   var idCheck = $(this).attr('id');
                   if($(this).is(':checked')){
                       $('.chkCompte').each(function(){
                           if($(this).attr('id') != idCheck){$(this).attr('checked', false);}
                       });
                   }
                });
                
                // Fonction pour la validation du nom d'usager
                $('#nouveauUsername').keypress(function(e){
                    if(e.keyCode == 20){e.preventDefault;}
                }).blur(function(){
                    var valeur = $(this).val().replace(/ /,'');
                    $(this).val(valeur);
                    if(valeur != ''){
                        validerUsername(valeur);
                        var vide = false;
                        $('.infoNouveau').each(function(){
                            if($(this).val().replace(/ /, '') == ''){vide = true;}
                        });
                        if(vide){$('#errNouvVide').show();}
                            else{$('#errNouvVide').hide();}
                    } else{
                        $('#errNouvVide').show();
                        $(this).addClass('invalide');
                    }
                });
                
                // Fonction pour la validation du mot de passe
                $('#nouveauPassword').keypress(function(e){
                    if(e.keyCode == 20){e.preventDefault;}
                }).blur(function(){
                    var valeur = $(this).val().replace(/ /,'');
                    $(this).val(valeur);
                    if(valeur != ''){
                        $(this).removeClass('invalide');
                        var vide = false;
                        $('.infoNouveau').each(function(){
                            if($(this).val().replace(/ /, '') == ''){vide = true;}
                        });
                        if(vide){$('#errNouvVide').show();}
                            else{$('#errNouvVide').hide();}
                    } else{
                        $('#errNouvVide').show();
                        $(this).addClass('invalide');
                    }
                });
                
                // Fonction pour s'assurer que les deux champs de mot de passe sont identiques
                $('#nouveauVerifPassword').blur(function(){
                    if($(this).val() != $('#nouveauPassword').val()){
                        $('#errPassword').show();
                        $(this).addClass('invalide');
                    } else{
                        $('#errPassword').hide();
                        $(this).removeClass('invalide');
                    }
                });
                
                // Fonction pour la validation du nom et du prénom
                $('#nouveauPrenom, #nouveauNom').blur(function(){
                    if($(this).val().replace(/ /,'') == ''){$(this).addClass('invalide');}
                    else{$(this).removeClass('invalide');}
                        
                    var vide = false;
                    $('.infoNouveau').each(function(){
                        if($(this).val().replace(/ /, '') == ''){vide = true;}
                    });
                    if(vide){$('#errNouvVide').show();}
                        else{$('#errNouvVide').hide();}
                });
                
                // Fonction pour la validation du courriel
                $('#nouveauCourriel').blur(function(){
                    var regex = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/;
                    var valeur = $(this).val().replace(/ /,'');
                    
                    if(valeur == ''){$(this).addClass('invalide');}
                    else if(!(regex.test(valeur))){$('#errCourriel').show();}
                    else{
                        $(this).removeClass('invalide');
                        $('#errCourriel').hide();
                    }
                        
                    var vide = false;
                    $('.infoNouveau').each(function(){
                        if($(this).val().replace(/ /, '') == ''){vide = true;}
                    });
                    if(vide){$('#errNouvVide').show();}
                        else{$('#errNouvVide').hide();}
                        
                    
                });
                
                // Fonction pour soumettre les informations du nouveau compte, si tout est valide
                $('#btnAccepterNouveau').click(function(){
                    var regex = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/;
                    var valide = true;
                    var vide = false;
                    $('.infoNouveau').each(function(){
                        if($(this).val().replace(/ /, '') == ''){
                            vide = true;
                            $(this).addClass('invalide');
                        }
                    });
                    if(vide){
                        $('#errNouvVide').show();
                        valide = false;
                    } else{
                        $('#errNouvVide').hide();
                        // On vérifie les mots de passe et le courriel
                        if($('#nouveauVerifPassword').val() != $('#nouveauPassword').val()){
                            $('#errPassword').show();
                            valide = false;
                        } else{$('#errPassword').hide();}
                        if(!(regex.test($('nouveauCourriel').val().replace(/ /,'') == ''))){
                            $('#errCourriel').show();
                            valide = false;
                        }
                    }
                    
                    if(valide){$('#formNouveauCompte').submit();}
                    else{alert('Vous devez corriger les erreurs avant de pouvoir ajouter le compte.')}
                });
                
                // Fonction pour fermer la fenêtre de nouveau compte
                $('.annulerNouveau').click(function(){
                    $('#espDisable').hide();
                    $('#espNouveau').fadeOut(250);
                });
                
                // Fonction pour ouvrir la fenêtre d'inscription aux cours
                $('#btnInscription').click(function(){
                    var idCompte = '';
                    
                    // On gère la possibilité qu'il n'y aille pas de résultats
                    if($('.chkCompte') !== undefined){
                        // On va chercher le compte sélectionné
                        $('.chkCompte').each(function(){
                            if($(this).is(':checked')){
                                idCompte = $(this).attr('id').substring(3);
                            }
                        });

                        if(idCompte == ''){alert('Vous devez sélectionner un compte');}
                        else{
                            $('#idCompteInscription').val(idCompte);
                            $('#espDisable').show();
                            $('#espInscription').fadeIn(250);
                        }
                    }                    
                });
                
                $('#txtRecherche').keypress(function(e){
                    if(e.keyCode == 10 || e.keyCode == 13){
                        $('#btnRechercher').click();
                    }
                });
                
                //Fonctions pour exécuter la recherche de cours
                $('#btnRechercher').click(function(){
                    var nom = $('#txtRecherche').val().replace(/ /, '').toLowerCase();
                    var domaine = $('#domaineInscription').val();
                    chercherCours(nom, domaine);
                });
                
                //Fonction pour retirer un destinataire de la sélection
                $('#choixRecherche li').click(function(){
                    $(this).remove();
                });
                
                // Fonction qui ajoute les destinataires choisis au message
                $('#accepterCours').click(function(){
                    if($('#choixRecherche').children().length > 0 ){
                        alert('error!!!')
                        $('#formInscription').submit();
                    }
                });
                
                // Fonction pour fermer la fenêtre d'inscription aux cours
                $('.annulerInscription').click(function(){
                    $('#espDisable').hide();
                    $('#espInscription').fadeOut(250);
                });
                
                // Fonction pour aller, si possible, à la prochaine page de messages 
                $('#prevMessages').click(function(){
                    var numero = $('#numPage').val();
                    if(numero > 1){
                        $('#numPage').val(--numero);
                        $('#formChangementPage').submit();
                    }
                });
                
                // Fonction pour aller, si possible, à la page précédente de messages 
                $('#nextMessages').click(function(){
                    var numero = $('#numPage').val();
                    if($('#totMessages').val() > ($('#numPage').val() * 20)){
                        $('#numPage').val(++numero);
                        $('#formChangementPage').submit();
                    }
                });
            });
        </script>
    </head>
    <body>
        <div id="bg-select">
            <ol>
                <li><img onclick="bgChange(1)" src="Images/select-bg1-red.gif"/></li>
                <li><img onclick="bgChange(2)" src="Images/select-bg1-green.gif"/></li>
                <li><img onclick="bgChange(3)" src="Images/select-bg1-blue.gif"/></li>
                <li><img onclick="bgChange(4)" src="Images/select-bg1-teal.gif"/></li>
                <li><img onclick="bgChange(5)" src="Images/select-bg1-gray.gif"/></li>
                <li><img onclick="bgChange(6)" src="Images/select-bg2-red.gif"/></li>
                <li><img onclick="bgChange(7)" src="Images/select-bg2-green.gif"/></li>
                <li><img onclick="bgChange(8)" src="Images/select-bg2-blue.gif"/></li>
                <li><img onclick="bgChange(9)" src="Images/select-bg2-teal.gif"/></li>
                <li><img onclick="bgChange(10)" src="Images/select-bg2-gray.gif"/></li>
                <li><img onclick="bgChange(11)" src="Images/select-bg3-red.gif"/></li>
                <li><img onclick="bgChange(12)" src="Images/select-bg3-green.gif"/></li>
                <li><img onclick="bgChange(13)" src="Images/select-bg3-blue.gif"/></li>
                <li><img onclick="bgChange(14)" src="Images/select-bg3-teal.gif"/></li>
                <li><img onclick="bgChange(15)" src="Images/select-bg3-gray.gif"/></li>
                <li><img onclick="bgChange(16)" src="Images/select-bg4-red.gif"/></li>
                <li><img onclick="bgChange(17)" src="Images/select-bg4-green.gif"/></li>
                <li><img onclick="bgChange(18)" src="Images/select-bg4-blue.gif"/></li>
                <li><img onclick="bgChange(19)" src="Images/select-bg4-teal.gif"/></li>
                <li><img onclick="bgChange(20)" src="Images/select-bg4-gray.gif"/></li>
                <li><img onclick="bgChange(21)" src="Images/select-bg5-red.gif"/></li>
                <li><img onclick="bgChange(22)" src="Images/select-bg5-green.gif"/></li>
                <li><img onclick="bgChange(23)" src="Images/select-bg5-blue.gif"/></li>
                <li><img onclick="bgChange(24)" src="Images/select-bg5-teal.gif"/></li>
                <li><img onclick="bgChange(25)" src="Images/select-bg5-gray.gif"/></li>
            </ol>
        </div>
        <div id="tete">
            <div id="logo">
            </div>
        </div>
        <div id="corps">
            <table id="espNavigation">
                <thead>
                    <tr>
                        <td>
                            <div id="navigation">
                                <ol class="nav">
                                    <li><a class="active" href="">Accueil</a></li>
                                    <%if(utilisateur != null && utilisateur.getStatut().equals("administrateur")){%>
                                        <li><a class="active" href="./GestionCompte">  Gestion des comptes</a></li>
                                    <%}%>
                                </ol>
                            </div>
                        </td>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>
                            <div id="espPrincipal">
                              <form id="formRecherche" action="./RechercheGestionCompte" method="post">
                                <table id="espRecherche" class="taillePetit alignTop fullWidth">
                                    <tr>
                                        <td>Username :</td>
                                        <td><input type="text" id="<%=ConstantesWeb.PARAM_RECH_USERNAME%>" name="<%=ConstantesWeb.PARAM_RECH_USERNAME%>" class="critere"/></td>
                                        <td>Sexe :</td>
                                        <td>
                                            <select id="<%=ConstantesWeb.PARAM_RECH_SEXE%>" name="<%=ConstantesWeb.PARAM_RECH_SEXE%>" class="fullWidth critere">
                                                <option value=""></option>
                                                <option value="M">Masculin</option>
                                                <option value="F">Féminin</option>
                                            </select>
                                        </td>
                                        <td>Domaine d'étude : </td>
                                        <td>
                                            <select id="<%=ConstantesWeb.PARAM_RECH_DOMAINE%>" name="<%=ConstantesWeb.PARAM_RECH_DOMAINE%>" class="critere">
                                               <option value=""></option>
                                               <%for(Map.Entry<Integer,String> domaine:domaines.entrySet()){%>
                                               <option value="<%=domaine.getValue()%>"><%=domaine.getValue()%></option>
                                               <%}%>
                                            </select>
                                        </td>
                                        <td rowspan="2"><input id="btnRecherche" type="button" value="Rechercher"/></td>
                                    </tr>
                                    <tr>
                                        <td>Nom : </td>
                                        <td><input type="text" id="<%=ConstantesWeb.PARAM_RECH_NOM%>" name="<%=ConstantesWeb.PARAM_RECH_NOM%>" class="critere"/></td>
                                        <td>Code permanent :</td>
                                        <td> <input type="text" id="<%=ConstantesWeb.PARAM_RECH_CODE%>" name="<%=ConstantesWeb.PARAM_RECH_CODE%>" class="critere"/></td>
                                        <td>Statut : </td>
                                        <td>
                                            <select id="<%=ConstantesWeb.PARAM_RECH_STATUT%>" name="<%=ConstantesWeb.PARAM_RECH_STATUT%>" class="fullWidth critere">
                                               <option value=""></option>
                                               <%for(Map.Entry<Integer,String> statut:statuts.entrySet()){%>
                                               <option value="<%=statut.getValue()%>"><%=statut.getValue()%></option>
                                               <%}%>
                                            </select>
                                        </td>
                                    </tr>
                                </table>
                              </form>
                              <form id="formResultats" action="./SauvegarderComptes" method="post">
                                <table id="espResultats" class="taillePetit fullWidth">
                                    <tr>
                                        <td class="titreResultat colCheck"></td>
                                        <td class="titreResultat colUsername">Username</td>
                                        <td class="titreResultat colPrenom">Prenom</td>
                                        <td class="titreResultat colNom">Nom</td>
                                        <td class="titreResultat colCode">Code</td>
                                        <td class="titreResultat colSexe">Sexe</td>
                                        <td class="titreResultat colCourriel">Courriel</td>
                                        <td class="titreResultat colDomaine">Domaine</td>
                                        <td class="titreResultat colStatut">Statut</td>
                                        <td class="titreResultat colActif">Actif</td>
                                    </tr>
                                    <%if(resultats.isEmpty()){%>
                                    <tr><td colspan="9" class="alignCenter fullWidth">***Aucun résultat trouvé***</td></tr>
                                    <%}else{%>
                                        <%for(int i = ((numPage - 1) * 20); i < (numPage * 20 - 1); i++){%>
                                            <%if(i < resultats.size()){
                                                CompteBean compte = resultats.get(i);
                                        %>
                                        <tr class="unCompte">
                                         <td>
                                             <input name="identifiant<%=compte.getIdCompte()%>" type="hidden" value="<%=compte.getIdCompte()%>"/>
                                             <input name="choisi<%=compte.getIdCompte()%>" id="chk<%=compte.getIdCompte()%>" class="chkCompte" type="checkbox"/>
                                         </td>
                                         <td><input type="hidden" name="username<%=compte.getIdCompte()%>" value="<%=compte.getUsername()%>"/><label for="chk<%=compte.getIdCompte()%>"><%=compte.getUsername()%></label></td>
                                         <td><input type="text" name="prenom<%=compte.getIdCompte()%>" value="<%=compte.getPrenom()%>"/></td>
                                         <td><input type="text" name="nom<%=compte.getIdCompte()%>" value="<%=compte.getNom()%>"/></td>
                                         <td><input type="text" name="code<%=compte.getIdCompte()%>" value="<%=compte.getCodePermanent()%>"/></td>
                                         <td>
                                             <select name="sexe<%=compte.getIdCompte()%>" class="fullWidth">
                                                <option value="" <%if(compte.getSexe().equals("")){%>selected<%}%>></option>
                                                <option value="M" <%if(compte.getSexe().equals("M")){%>selected<%}%>>Masculin</option>
                                                <option value="F" <%if(compte.getSexe().equals("F")){%>selected<%}%>>Féminin</option>
                                             </select>
                                         </td>
                                         <td><input type="text" name="courriel<%=compte.getIdCompte()%>" value="<%=compte.getCourriel()%>"/></td>
                                         
                                         <td>
                                             <select name="domaine<%=compte.getIdCompte()%>">
                                                <option value=""></option>
                                                <%for(Map.Entry<Integer,String> domaine:domaines.entrySet()){%>
                                                <option value="<%=domaine.getValue()%>" <%if(compte.getDomaineEtude().equals(domaine.getValue())){%>selected<%}%>><%=domaine.getValue()%></option>
                                                <%}%>
                                             </select>
                                         </td>
                                         <td>
                                             <select name="statut<%=compte.getIdCompte()%>" class="fullWidth">
                                                <option value=""></option>
                                                <%for(Map.Entry<Integer,String> statut:statuts.entrySet()){%>
                                                <option value="<%=statut.getValue()%>" <%if(compte.getStatut().equals(statut.getValue())){%>selected<%}%>><%=statut.getValue()%></option>
                                                <%}%>
                                             </select>
                                         </td>
                                         <td>
                                             <%if(compte.getIdCompte() != utilisateur.getIdCompte()){%>
                                             <select name="actif<%=compte.getIdCompte()%>" class="fullWidth">
                                                <option value="O" <%if(compte.getActif().equals("O")){%>selected<%}%>>Oui</option>
                                                <option value="N" <%if(compte.getActif().equals("N")){%>selected<%}%>>Non</option>
                                             </select>
                                             <%}else{%>
                                                <%=compte.getActif().equals("O") ? "Oui":"Non"%>
                                             <%}%>
                                         </td>
                                        </tr>
                                        <%}else{%>
                                            <tr class="messageVide">
                                                <td colspan="4">&nbsp;</td>
                                            </tr>
                                        <%}
                                      }
                                    }%>
                                    <tr>
                                            <td class="fullWidth alignRight taillePetit alignMiddle" colspan="10">
                                                Comptes <%=numPage * 20 - 19%>-<%=numPage * 20%>&nbsp;&nbsp;
                                                <img id="prevMessages" class="pointer" src="Images/Button-Previous-icon.png"/>&nbsp;
                                                <img id="nextMessages" class="pointer" src="Images/Button-Next-icon.png"/>&nbsp;&nbsp;&nbsp;
                                            </td>
                                    </tr>
                                </table>
                                <div class="fullWidth">
                                    <input type="button" id="btnNouveau" class="alignCenter pointer" value="Nouveau compte"/>
                                    <input type="submit" id="btnSauvegarder" class="alignCenter pointer" value="Sauvegarder les modifications" <%if(resultats.isEmpty()){%>disabled<%}%> />
                                    <input type="button" id="btnInscription" class="alignCenter pointer" value="Gérer les cours du compte sélectionné" <%if(resultats.isEmpty()){%>disabled<%}%>/>         
                                </div>
                              </form>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div id="espNouveau" class="elemCache">
          <form id="formNouveauCompte" action="./CreationCompte" method="post">
            <table class="fullWidth">
                <thead>
                    <tr>
                        <td>Création de compte <span class="pointer annulerNouveau right">[x]</span></td>
                    </tr>
                </thead>
                <tbody class="taillePetit">
                    <tr>
                        <td><span id="errNouvVide" class="taillePetit elemCache"><em>Vous devez remplir tous les champs obligatoires.</em></span>&nbsp;</td>
                    </tr>
                    <tr>
                        <td>Nom d'usager<em>*</em>: <span id="errUsername" class="elemCache"><em>Nom d'usager déjà utilisé</em></span> <input id="nouveauUsername" name="username" type="text" class="infoNouveau fullWidth"/></td>
                    </tr>
                    <tr>
                        <td>Prenom<em>*</em>: <input id="nouveauPrenom" name="prenom" type="text" class="infoNouveau fullWidth"/></td>
                    </tr>
                    <tr>
                        <td>Nom<em>*</em>: <input id="nouveauNom" name="nom" type="text" class="infoNouveau fullWidth"/></td>
                    </tr>
                    <tr>
                        <td>Mot de passe<em>*</em>: <span id="errPassword" class="elemCache"><em>Les deux mots de passe doivent être identiques</em></span> <input id="nouveauPassword" name="password" type="password" class="infoNouveau fullWidth"/></td>
                    </tr>
                    <tr>
                        <td>Ré-entrer mot de passe<em>*</em>: <input id="nouveauVerifPassword" name="verifPassword" type="password" class="fullWidth"/></td>
                    </tr>
                    <tr>
                        <td>Code permanent: <input id="nouveauCode" name="code" type="text" class="fullWidth"/></td>
                    </tr>
                    <tr>
                        <td>Courriel<em>*</em>: <span id="errCourriel" class="elemCache"><em>Format du courriel invalide</em></span><input id="nouveauCourriel" name="courriel" type="text" class="infoNouveau fullWidth"/></td>
                    </tr>
                    <tr>
                        <td>Sexe<em>*</em>:
                            <select id="nouveauSexe" name="sexe" class="fullWidth">
                                <option value="M">Masculin</option>
                                <option value="F">Féminin</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Domaine d'étude<em>*</em>:
                            <select id="nouveauDomaine" name="domaine" class="fullWidth">
                                <%for(Map.Entry<Integer,String> domaine:domaines.entrySet()){%>
                                <option value="<%=domaine.getValue()%>"><%=domaine.getValue()%></option>
                                <%}%>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Statut<em>*</em>:
                            <select id="nouveauStatut" name="statut" class="fullWidth">
                                <%for(Map.Entry<Integer,String> statut:statuts.entrySet()){%>
                                <option value="<%=statut.getValue()%>"><%=statut.getValue()%></option>
                                <%}%>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td><span><em>*</em>Champs obligatoires</span></td>
                    </tr>
                    <tr class="fullWidth">
                        <td class="alignCenter">
                            <input type="button" id="btnAccepterNouveau" value="Envoyer" class="pointer"/>
                            <input type="button" class="annulerNouveau pointer" value="Annuler"/>
                        </td>
                    </tr>
                </tbody>
            </table>
          </form>
        </div>
        <div id="espInscription">
          <form id="formInscription" action="./ConnecterCompteACours" method="post">
            <table class="fullWidth fullHeight">
                <thead>
                    <tr>
                        <td colspan ="2">Inscription à des cours<span class="pointer annulerInscription right">[x]</span></td>
                    </tr>
                </thead>
                <tbody class="taillePetit">
                    <tr>
                        <td colspan="2">
                            Nom: <input id="txtRecherche" type="text"> 
                            Domaine d'étude:
                            <select id="domaineInscription" name="domaine">
                                <%for(Map.Entry<Integer,String> domaine:domaines.entrySet()){%>
                                <option value="<%=domaine.getValue()%>"><%=domaine.getValue()%></option>
                                <%}%>
                            </select>
                            <input id="btnRechercher" type="button" value="Rechercher"/>
                        </td>
                    </tr>
                    <tr class="resultatsDest">
                        <td  class="alignTop">
                            <div>
                                <ul id="resultatsRecherche" class="noBulletList"></ul>
                            </div>
                        </td>
                         <td id="espListChoix" class="borderLeft resultatsDest alignTop">
                            <span class="bold taillePetit alignCenter">Cours inscrits</span><br/>
                            <ul id="choixRecherche"></ul>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" class="fullWidth alignCenter">
                            <input type="hidden" id="idCompteInscription" name="idCompte"/>
                            <input id="accepterCours" type="button" value="Sauvegarder les changements"/>
                            <input class="annulerInscription" type="button" value="Annuler"/>
                        </td>
                    </tr>
                </tbody>
            </table>
          </form>
        </div>
        <div id="espDisable" class="disable"></div>     
        <form id="formChangementPage" action="./ChangementPage" method="post">
            <input type="hidden" name="<%=ConstantesWeb.PARAM_NEXT%>" value="<%=ConstantesWeb.ATTRIBUT_PAGE_GESTIONCOMPTE%>"/>
            <input type="hidden" id="numPage" name="<%=ConstantesWeb.PARAM_NUM_PAGE%>" value="<%=numPage%>"/>
            <input type="hidden" id="totMessages" value="<%=resultats.size()%>"/>
        </form>
    </body>
</html>
